<template>
  <div id="centreRight1">
    <div class="bg-color-black">
      <div class="d-flex pt-2 pl-2">
        <span style="color:#5cd9e8">
          <icon name="chart-line"></icon>
        </span>
        <div class="d-flex">
          <span class="fs-xl text mx-2">执业资格统计</span>
        </div>
      </div>
      <div class="d-flex jc-center body-box">
        <dv-scroll-ranking-board :config="config" style="width:400px;height:300px" />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ["listData"],
  watch: {
    listData(newValue) {
      const { config } = this;
      this.config.data = newValue;
      this.config = { ...this.config };
    }
  },
  data() {
    return {
      //data: this.listData,
      config: {
        data:this.listData,
        unit: '人'
        // data: [
        //   {
        //     name: "周口",
        //     value: 55
        //   },
        //   {
        //     name: "南阳",
        //     value: 120
        //   },
        //   {
        //     name: "西峡",
        //     value: 78
        //   },
        //   {
        //     name: "驻马店",
        //     value: 66
        //   },
        //   {
        //     name: "新乡",
        //     value: 80
        //   },
        //   {
        //     name: "信阳",
        //     value: 45
        //   },
        //   {
        //     name: "漯河",
        //     value: 29
        //   }
        // ]
      }
    };
  },

  components: {},
  mounted() {},
  methods: {}
};
</script>

<style>
#centreRight1 {
  padding: 1rem;
  height: 410px;
  min-width: 500px;
  border-radius: 5px;
}

.bg-color-black {
  height: 385px;
  border-radius: 10px;
}
.text {
  color: #c3cbde;
}
.body-box {
  border-radius: 10px;
  overflow: hidden;
}
</style>